<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/include.jsp" %>
<%@ include file="/WEB-INF/jsp/header.jsp" %>


<script>
	var min = Number.MAX_VALUE;
	var emails = [<c:forEach items="${persons}" var="prs" varStatus="i"> 
		   		"${prs.email}"
	   			<c:if test="${!i.last}">    
             		,    
           		</c:if>
			</c:forEach>];
	var orders = [<c:forEach items="${orders}" var="prs" varStatus="i"> 
		   		"${prs.email}"
	   			<c:if test="${!i.last}">    
             		,    
           		</c:if>
			</c:forEach>];
	function onch() {
		var st1 = document.getElementById("st1");	
		var st2 = document.getElementById("st2");
		for (var i = 0; i < st1.options.length; i++) {
			st1.options[i].style.display = "inline";
			st2.options[i].style.display = "inline";
		}	
		for (var i = 1; i <= st1.value; i++)
			st2.options[i].style.display = "none";
		if (st2.value != 0) {
			for (var i = st2.value; i < st1.options.length; i++)
				st1.options[i].style.display = "none";
		}
		if (document.getElementById("info") != null)
			document.getElementById("info").remove();
		if (st1.value != 0 && st2.value != 0) {
			var price = ${price};
			var seats = ${seats};
			var pr = 0;
			for (i = st1.value - 1; i < st2.value - 1; i++) {
				if (min > seats[i])
					min = seats[i];
			}
			for (i = st1.value; i <= st2.value - 1; i++) {
				pr += price[i];
			}
			var p = document.createElement("P");
			p.id = "info";
			p.innerHTML = "Цена: " + pr + ". ";
			if (min < 1)
				p.innerHTML += "Нет свободных мест.";
			else
				p.innerHTML += "Количество мест: " + min + ".";
			var button = document.getElementById("order");
			var form = document.getElementById("orderForm");
		 	form.insertBefore(p, button);
		}
	}
	function check() {
		var b = true;
		var list = $("select");
		for (var j = 0; j < list.length; j++)
		 		list[j].style.color="black";
		for (var j = 0; j < list.length; j++) {
			if (list[j].value == 0) {
				list[j].style.color="red";
				for(var i = 0; i < list[j].options.length; i++)
					list[j].options[i].style.color="black";
				b = false;
			}
		}
		if (min < 1)
			b = false;
		var q = document.getElementById("email");
		x = q.value;
		var found = false;
		for (var i = 0; i < emails.length; i++) {
			if (emails[i].toLowerCase() == x.toLowerCase()) {
				found = true;
				break;
			}
		}
		var already = false;
		for (var i = 0; i < orders.length; i++) {
			if (orders[i].toLowerCase() == x.toLowerCase()) {
				already = true;
				break;
			}
		}
		if (!found || already) {
			if(document.getElementById("error") == null) {
					var p = document.createElement("P");
					p.id = "error";
					if (!found)
						p.innerHTML += "Не найдено пользователя с таким E-mail'ом. ";
					if (already)
						p.innerHTML += "Вы уже совершали заказ на данный маршрут. ";
					document.body.appendChild(p);
			}
			q.focus();
			return false;
		} 
		else {
			var p = document.getElementById("error"); 
			if (p != null)
				p.remove();
		}
		return b;
	}
</script>
<title>Оформление заказа на рейс №${trip.number}</title>
<a href="trip?id=${trip.id}">
	<div class="mybutton">
		К рейсу
	</div>
</a>
<br><br><br>
<form id="orderForm" method="POST" action="order?id=${trip.id}" onsubmit="return check()">
	<input id="email" name="email" type="email" placeholder="email"
		data-validation="required, email, length" data-validation-length="max40"/>
	<br>
	<select id="st1" name="st1" onchange="onch()">
			<option value="0" selected >От</option>
			<c:forEach items="${stops}" var="stop" varStatus="i">
				<option value="${i.index + 1}">${stop.name}</option>
			</c:forEach>
	</select>
	<select id="st2" name="st2" onchange="onch()">
			<option value="0" selected >До</option>
			<c:forEach items="${stops}" var="stop" varStatus="i">
				<option value="${i.index + 1}">${stop.name}</option>
			</c:forEach>
	</select>
	<br>
	<input id="order" class="button" type="submit" value="Заказать"/>
</form>
<%@ include file="/WEB-INF/jsp/footer.jsp" %>